<script setup>

</script>

<template>
  <div class="index-body">
    <router-link to="/cropper">图片裁剪案例</router-link>
    <router-link to="/icon">引入Element Plus图标</router-link>
    <router-link to="/font-awesome/icon">引入Font Awesome图标</router-link>
    <router-link to="/svg/icon">引入Svg图标</router-link>
    <router-link to="/login">登录注册</router-link>
    <router-link to="/main">首页面</router-link>
  </div>
</template>

<style scoped>
.index-body {
  padding: 50px;
  margin: 0 auto;
  
  > a {
    display: inline-block;
    margin: 0 10px;
    padding: 10px 20px;
    border: 1px solid #ccc;
  }
  
  > a:hover {
    box-shadow: 0 0 10px 5px rgba(16, 168, 147, 0.3);
  }
}
</style>